<template>
    <div class="item" @click="handleClick(item.id,item.name)">
        <img :src="item.coverImgUrl?item.coverImgUrl:item.picUrl" alt="">
        <p>{{item.name}}</p>
    </div>
</template>

<script>
export default {
    props:{
        item:{
            type:Object
        }
    },
    methods:{
        handleClick(id,name){
            // console.log(id)
            this.$emit("toggle",id,name);
        }
    }
}
</script>

<style scoped>
.item img{
    width:150px;
    height: 150px;
}
.item{
    width:150px;
    border:1px solid #333;
    padding:10px;
}
</style>